<template>
    <div class="five">
        <p>Web 上的图像都很漂亮。我们也来创建一个。首先我们准备一张图片放置到和HTML文件相同的文件夹下。</p>
        <p>然后使用<code>img</code>标签标记图像元素。语法如下，注意<code>html.jpg</code>为图片的文件名</p>
        <pre><code class="hljs routeros">&lt;img <span class="hljs-attribute">src</span>=<span class="hljs-string">"html.jpg"</span>&gt;
        </code>
        </pre>
        <p>
            <code>img</code>不像是<code>h1</code>有开始标签和结束标签，这种不需要结束标签的元素我们称他们为空元素。通常空元素用来告知浏览器在此元素所在位置插入/嵌入一些东西。<code>img</code>就表示在<code>img</code>出现的位置插入一张指定的图片。插入的这张图片可以根据<code>src</code>指定的路径来找到</p>
        <p>在元素标签中可以添加属性，属性包含了元素的额外信息。这些信息不会出现在实际的内容中。</p>
    </div>
</template>
<script>

export default ({
    name:'five',
    data(){
        return{
        }
    },
    methods:{
    }
})
</script>
<style scoped>

.five{
    width: 70%;
    height: 600px;
    color: black;
    margin: 40px auto;
    font-size: 12px;
    overflow: scroll;
}
.five img{
    width: 90%;
}
</style>
